<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>添加白名单用户</title>

    <link rel="stylesheet" href="http://cdn.viptool.cn/lib/bootstrap/3.3.5/css/bootstrap.min.css">
    <link href="../../resource/hotui/css/font-awesome.min.css" th:href="@{/resource/hotui/css/font-awesome.min.css}"
          rel="stylesheet">
    <!-- Morris -->
    <link href="http://cdn.viptool.cn/lib/morris.js/0.4.3/morris.css" rel="stylesheet">
    <link href="http://cdn.viptool.cn/lib/animate.css/2.1.1/animate.min.css" rel="stylesheet">

    <link href="../../resource/hotui/css/style.min-1.0.8.css" th:href="@{/resource/hotui/css/style.min-1.0.8.css}"
          rel="stylesheet">
    <link href="../../resource/hotui/css/hotui.style.override.css"
          th:href="@{/resource/hotui/css/hotui.style.override.css}" rel="stylesheet"/>

    <link href="../../resource/lib/bootstrap-datepicker/css/bootstrap-datepicker.min.css" th:href="@{/resource/lib/bootstrap-datepicker/css/bootstrap-datepicker.min.css}" rel="stylesheet"/>
</head>

<body class="gray-bg">
<form id="saveForm">
    <div class="wrapper wrapper-content animated fadeInRight tooltip-demo">
        <div class="row">
            <div class="col-lg-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title" style="min-height: 60px;">
                        <h5>添加白名单用户 </h5>
                    </div>

                    <div class="ibox-content">
                        <div class="panel-body form-horizontal">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">*用户名/手机号：</label>
                                <div class="col-sm-10">
                                    <input type="text" required name="username" id="username" class="form-control input-sm input-s" placeholder="用户名/手机号"/>
                                </div>
                            </div>
                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">*密码：</label>
                                <div class="col-sm-10">
                                    <input type="password" required name="password" id="password" class="form-control input-sm input-s" placeholder="密码"/>
                                </div>
                            </div>
                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">*确认密码：</label>
                                <div class="col-sm-10">
                                    <input type="password" required equalTo="#password" name="confirmPwd" id="confirmPwd" class="form-control input-sm input-s" placeholder="确认密码"/>
                                </div>
                            </div>
                            <div class="hr-line-dashed"></div>
                            <div class="form-group form-inline">
                                <label class="col-sm-2 control-label">*姓名：</label>
                                <div class="col-sm-10">
                                    <input required type="text" name="realName" id="realName" class="form-control input-sm input-s" placeholder="微信号"/>
                                </div>
                            </div>
                            <div class="hr-line-dashed"></div>
                            <div class="form-group form-inline">
                                <label class="col-sm-2 control-label">归属上级：</label>
                                <div class="col-sm-10">
                                    <input type="text" name="parentMobile" id="parentMobile" class="form-control input-sm input-s" placeholder="上级代理手机号"/>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="panel-body">
                            <div class="row">
                                <div class="col-lg-12">
                                    <div class="ibox float-e-margins m-b-none">
                                        <div class="ibox-content no-borders text-center">
                                            <button type="submit" class="btn btn-primary m-b-none m-l">保存
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
</form>

<!--基础框架js-->
<script src="http://cdn.viptool.cn/lib/jquery/2.2.4/jquery.min.js"></script>
<script src="http://cdn.viptool.cn/lib/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="../../resource/hotui/js/hot/bootstrap.hot.extra-utils.js?20190316"
        th:src="@{/resource/hotui/js/hot/bootstrap.hot.extra-utils.js?20190316}"></script>
<script src="../../resource/hotui/js/hot/bootstrap.hot.extra-init.js?20190316"></script>

<script src="../../resource/hotui/js/content.min.js" th:src="@{/resource/hotui/js/content.min.js}"></script>

<script src="http://cdn.viptool.cn/lib/jquery-validate/1.17.0/jquery.validate.min.js"></script>
<script src="http://cdn.viptool.cn/lib/jquery-validate/1.17.0/localization/messages_zh.min.js"></script>
<script src="../../resource/hotui/js/hot/bootstrap.hot.extra-validate.js"
        th:src="@{/resource/hotui/js/hot/bootstrap.hot.extra-validate.js}"></script>
<script type="text/javascript">
    $(function () {
        $("#saveForm").validateCallback(function () {
            userHandler.save();
        }, {
            ignore: "",
            rules: {
                username: {
                    required: true,
                    mobile: true
                }
            },
            messages: {
                username: {
                    mobile: "请输入正确的手机号码"
                }
            }
        });
    });

    var userHandler = {
        save: function () {
            let username = $.trim($("#username").val());
            let password = $.trim($("#password").val());
            let realName = $.trim($("#realName").val());
            let parentMobile = $.trim($("#parentMobile").val());
            let requestData = $.extend({}, {
                username: username,
                password: password,
                realName: realName,
                parentMobile: parentMobile
            });

            hot.ajax("register", requestData, function (apiResult) {
                if (apiResult.resultCode === 2000) {
                    hot.tip.success("注册成功", function () {
                        window.location.reload();
                    });
                } else {
                    hot.tip.error("注册失败--" + apiResult.resultMsg);
                }
            }, function () {
            }, "post", 300);
        }
    }
</script>
</body>

</html>
